<template>
  <view class="keyboard">
    <view class="line_part">
      <view class=" top_key" @tap="final('100')">100</view>
      <view class="key_item" @tap="addNumber('1')">1</view>
      <view class="key_item" @tap="addNumber('4')">4</view>
      <view class="key_item" @tap="addNumber('7')">7</view>
      <view class="key_item" @tap="addNumber('00')">00</view>
    </view>
    <view class="line_part">
      <view class=" top_key" @tap="final('200')">200</view>
      <view class="key_item" @tap="addNumber('2')">2</view>
      <view class="key_item" @tap="addNumber('5')">5</view>
      <view class="key_item" @tap="addNumber('8')">8</view>
      <view class="key_item" @tap="addNumber('0')">0</view>
    </view>
    <view class="line_part">
      <view class=" top_key" @tap="final('300')">300</view>
      <view class="key_item" @tap="addNumber('3')">3</view>
      <view class="key_item" @tap="addNumber('6')">6</view>
      <view class="key_item" @tap="addNumber('9')">9</view>
      <view class="key_item" @tap="addNumber('.')">.</view>
    </view>
    <view class="line_part">
      <view class=" top_key" @tap="final('500')">500</view>
      <view class="key_item" @tap="delNumber()">
        <!-- <img style="width:34px;margin-top:8px" src="@/../public/images/backspace.png" alt=""> -->
        <AtIcon value='arrow-left' size='30' color='#333'></AtIcon>
      </view>
      <view class="key_item3x" @tap="closeInput()">完 成</view>
    </view>
  </view>
</template>

<script>
import './myKeyboard.scss'
export default {
  components: {
  },
  props:{
  },
  data(){
    return{
      number:"",
    }
  },
  methods: {
    final(val){
      this.number = val;
      console.log(this.number);
      this.$emit('onUpdateInput',this.number);
      // this.props.onUpdateInput(this.number);
    },
    addNumber(i){
      if(this.number.indexOf('.') != -1 && i == '.'){ // 防止多次输入小数点
        return false;
      }
      if(this.number == "0"){
        if(i == '.'){
          this.number += i;
        }else{
          this.number = i;
        }
      }else{
        this.number += i;
      }
      this.$emit('onUpdateInput',this.number);
    },
    delNumber(){
      this.number = this.number.substring(0, this.number.length - 1);
      if(this.number == ""){
        this.number = "0"
      }
      this.$emit('onUpdateInput',this.number);
    },
    closeInput(){
      this.$emit('onCloseInput');
    }
  }
}
</script>